<template>
  <page-frame class="expand-wait" :showPageRefresh="showPageRefresh" v-model:refresh-loading="pageRefreshLoading"
    @onRefresh="goBackOrForward(0)">
    <template #header-title>
      {{ title }}
    </template>
    <div class="main" v-if="taskDetailInfo">
      <page-line-text label="Machine" :text="taskDetailInfo.short"></page-line-text>
      <page-line-text label="Product" :text="taskDetailInfo.prod"></page-line-text>
      <page-line-text label="Jam 种类" :text="taskDetailInfo.contents?.category"></page-line-text>
      <page-line-text label="Jam Code" :text="taskDetailInfo.contents?.jam"></page-line-text>
      <page-line-text label="Jam Rate (总数/1个班时间)" :text="taskDetailInfo.contents?.rate" append-text=" 个"></page-line-text>
      <page-line-text label="Urgent" :text="getUrgentValue(taskDetailInfo.urgent)"></page-line-text>

      <div class="p10">
        <van-button type="primary" class="w" round color="#5b67ca" size="small" @click="acceptOrder()">
          接单
        </van-button>
      </div>
      <div class="f-b box-b p-l10 p-r10 m-t10">
        <van-button type="primary" class="w4" round color="#EC9D0B" size="small" @click="cancelOrTransparentOrder(true)">
          申请取消
        </van-button>
        <van-button type="primary" class="w4" round color="#5BC6CA" size="small" @click="cancelOrTransparentOrder(false)">
          申请转交
        </van-button>
      </div>
    </div>
    <div v-else class="main">
      <van-empty description="出现错误，下拉刷新试试!"></van-empty>
    </div>
  </page-frame>
</template>
<script lang="ts">
import pageBase from '@/views/mixins/page-base'
import { PendingApi } from '@/apis/pending/pending'
import { Dialog, Notify, Toast } from 'vant'
import { type RequestCode } from '@/server/base'
import pageRefresh from '@/views/mixins/page-refresh'
import { defineComponent } from 'vue'

import PageFrame from '@/views/components/page-frame/index.vue'
import PageLineText from '@/views/components/page-line-text/index.vue'

type DetailInfo = {
  id: string
  short: string
  prod: string
}
export default defineComponent({
  mixins: [pageBase, pageRefresh],
  components: { PageFrame, PageLineText },
  props: {
    visible: {
      type: Boolean,
      default: false
    }
  },
  computed: {
    value(): DetailInfo {
      const itemStr: any = this.$route.params.value
      return this.getParamsByString(itemStr) //JSON.parse(unescape(itemStr))
    },
    title(): string {
      return `JAM维修-工单${this.value.id}`
    },
  },
  methods: {
    acceptOrder() {
      Dialog.confirm({
        title: '提示',
        message: '确定接单吗？'
      })
        .then(() => {
          PendingApi.receiving(this.value.id)
            .then((res: RequestCode) => {
              // Dialog.confirm({
              //   title: '提示',
              //   message: '接单成功,是否进行?'
              // })
              //   .then(() => {
              // this.$router.push({ name: 'going', params: { formType: 'wait' } })
              this.$router.push({
                name: 'going-detail', params: {
                  value: this.getParamsString(this.value),
                  formType: 'wait',
                }
              });

              // })
              // .catch(() => {
              //   this.goBackOrForward(-1)
              // })
            })
            .catch((error: any) => {
              Notify({ type: 'danger', message: error.msg })
            })
        })
        .catch(() => { })
    },
    cancelOrTransparentOrder(isCancel: boolean = true) {
      this.$router.push({
        name: 'wait-detail-reject',
        params: {
          value: this.getParamsString(this.taskDetailInfo),
          type: isCancel ? 'cancel' : 'transformation'
        }
      })
    }
  },
  created() {
    this.getTaskDetailById(this.value.id);
  }
})
</script>

<style scoped></style>
